<template>
  <div class="advantage-box">
    <dv-scroll-board :config="config" style="width:100%;height:17vh;" />
  </div>
</template>

<script>
export default {
  name: 'Advantage',
  props: {
    data: {
      type: Array,
      default() {
        return []
      }
    },
    type: {
      type: String,
      default() {
        return "parkPurpose"
      }
    },
    header: {
      type: Array,
      default() {
        return []
      }
    }
  },
  data() {
    return {
      config: {
        header: ['企业名称', '注册资本', '区域'],
        data: [],
        index: true,
        columnWidth: [50, 180],
        align: ['center'],
        headerHeight: 20,
        indexHeader: '序号',
        headerBGC: '',
        oddRowBGC: '',
        evenRowBGC: '#082847'
      }
    }
  },
  watch: {
    data(val) {
      for (let i = 0; i < val.length; i++) {
        if (this.type === "parkPurpose") {
          this.config.data.push([
            val[i].company_name,
            val[i].output_value,
            val[i].pay_duty,
            // val[i].tags
          ])
          if (this.$route.name === 'data/park/index') {
            this.config.columnWidth = [50, 100]
          }
          if (this.$route.name === 'data/park/screen') {
            this.config.columnWidth = [50, 180]
          }
        }
        if (this.type === "parkForecast") {
          this.config.data.push([
            val[i].company_name,
            val[i].revenue_value,
            val[i].industry
          ])
          if (this.$route.name === 'data/park/index') {
            this.config.columnWidth = [50, 100]
          }
          if (this.$route.name === 'data/park/screen') {
            this.config.columnWidth = [50, 180]
          }
        }
      }
      this.config = { ...this.config }
    },
    header(val) {
      this.config.header = this.header
      this.config = { ...this.config }
    }
  },
}
</script>

<style>
.dv-scroll-board .header, .dv-scroll-board .rows .row-item {
  font-size: 7px;
}
</style>
